﻿/*
* 
* Theme Name: Whitlist
* Version: 1.0
* Author: Vojta Tremcinsky @ Glass Partnership, ltd.
* Author URI: http://www.glasspartnership.co.uk/
*
* CONTENTS:
* 1) RESET
* 2) GENERAL
* 3) REGIONS
* 4) HEADER
* 5) NAVIGATION
* 6) CONTENT
* 7) FOOTER
* 8) MISC
* 
*/

/*************** RESET ***************/


HTML, BODY, DIV, SPAN, APPLET, OBJECT, IFRAME,
H1, H2, H3, H4, H5, H6, P, BLOCKQUOTE, PRE,
A, ABBR, ACRONYM, ADDRESS, BIG, CITE, CODE,
DEL, DFN, EM, FONT, IMG, INS, KBD, Q, S, SAMP,
SMALL, STRIKE, STRONG, SUB, SUP, TT, VAR,
B, U, I, CENTER,
DL, DT, DD, OL, UL, LI,
FIELDSET, FORM, LABEL, LEGEND,
TABLE, CAPTION, TBODY, TFOOT, THEAD, TR, TH, TD {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
INPUT, SELECT, TEXTAREA, LABEL {
		font-family: Arial, Verdana, Helvetica, sans-serif;
		font-size: 1.1em;
}
/*************** GENERAL ***************/
HTML,BODY {
	width:100%;
	min-height: 100%;
}

BODY {
	font-family:"Lucida Grande","Lucida Sans Unicode","Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 62.51%;
	background: #1c2e3b;
	/*color: #333333;*/
}

/*------------------ @global ------------------*/

a {
	color: #44688b;
}
a:hover {
		color: #610A2E;
	}

#container {
	width: 100%;
	height: 100%;
}

.container {
	width: 98%;
	min-width:800px;
	max-width:1600px;
	margin: 0 auto;
	overflow: hidden;
}
h2 {
	font-size: 24px;
	padding-bottom: 10px;
	color: #0b4751;
	font-weight: normal;
}

h3 {
	color: #0b4751;
	padding-bottom: 5px;
	font-size: 18px;
	font-weight: normal;
	height: 20px;
}
	
	h3 span {
		font-size: 12px;
		color: #666;
	}
	
		h3 span a {
			color: #666;
		}
		
	h3 strong {
		font-weight: normal;
	}
	
	hr {
		height: 0;
		border: 0;
		border-bottom: 2px solid #d4d4d4;
		clear: left;
	}
	
	.form hr {
		width: 385px;
		margin: 15px 0;
		padding-top: 15px;
	}



/*------------------ @Header ------------------*/

#Header{
    background:url(../Images/Header_bg.png) repeat-x top left;
    height:50px;
    }
    #Header .container {
		/*background: url(../images/header-container-bg.png) no-repeat center top;*/
		height: 50px;
	}

#Header h1, #Header h1 a {
		display: block;
		width: 108px;
		height: 50px;
	}
	
		#Header h1 {
			width: 108px;
			float: left;
		}
	
		#Header h1 a {
			background: url(../Images/Logo.png) no-repeat 0 center;
			text-indent: -9999px;
		}
/*------------------ @nav ------------------*/
ul#nav {
    display:block;
    width:400px;
	list-style: none;
	margin: 0 auto;
	height:50px;
	padding: 12px 0 0 50px;
	background: url(../Images/Header-Texture_bg.png) no-repeat top right;
}
	ul#nav li {
		margin-right: 10px;
	}
	
	ul#nav li,
	ul#nav li a,
	ul#nav li a span {
		float: left;
		display: block;
		line-height: 12px;
	}
	
	ul#nav li a {
		text-decoration: none;
		color: #B5DCDF;
		padding-left: 9px;
	}
	
		ul#nav li a span {
			padding: 6px 10px 6px 0;
		}
	
		ul#nav li.active a {
			background: url(../Images/nav-active-left.gif) no-repeat left 0;
			color: #fff;
		}
		
			ul#nav li.active a span {
				background: url(../Images/nav-active.gif) no-repeat right 0;
				color: #fff;
			}
			
		ul#nav li a:hover,
		ul#nav li a:hover span { 
			color: #fff; 
			text-decoration: underline;
		}
		

/*------------------ @supernav ------------------*/
ul#supernav {
	float: right;
	list-style: none;
	margin: 0;
	padding: 14px 0 0 0;
}

	ul#supernav li,
	ul#supernav li a {
		float: left;
		display: block;
		line-height: 12px;
	}
	
		ul#supernav li {
			/*background: url(../images/supernav-separator.png) no-repeat right center;*/
			padding: 4px 12px 4px 10px;
			border-right:1px solid #101a23;
			color:#B5DCDF;
		}
		
			ul#supernav li.last {
				background: none;
				padding-right: 0;
				border-right: 0;
			}
	
		ul#supernav li a {
			text-decoration: none;
			color: #B5DCDF;
		}
		
			ul#supernav li a:hover { 
				color: #fff; 
				text-decoration: underline;
			}
	
		ul#supernav li a#beta {
			color: #D6D6AA;
		}

/*------------------ @main ------------------*/
#Main {
	padding: 20px 0;

}
/*------------------ @#Main-Top ------------------*/
	#Main-Top {
		background: url(../Images/Content_bg.png) repeat-x 0 0;
		height: 73px;
		position: relative;
		-moz-border-radius-topleft:9px;
        -moz-border-radius-topright:9px;
        -webkit-border-radius-topleft: 9px;
        -webkit-border-radius-topright: 9px;
		
	}
	    #Main-Top h2 {
			    float: left;
			    margin-left: 10px;
			    color: #fff;
			    font-weight: normal;
			    font-size: 2.44em;
			    height: 49px;
			    padding: 25px 20px 0 0px;
			    min-width: 290px;
			    text-shadow:1px 1px 0 #1c2e3b;
		}
		#control-button,
		#control-button2,
		#control-button3 {
			position: absolute;
			right: 20px;
			top: 18px;
			background: url(../Images/main-top-button.png) no-repeat 0 0;
			display: block;
			width: 135px;
			height: 28px;
			padding-top: 8px;
			text-transform: uppercase;
			text-align:center;
			text-decoration: none;
			font-weight: bold;
			color: #0b424a;
			font-size: 11px;
		}
		
		#control-button2 {
			right: 160px;
		}
		#control-button3 {
			right: 300px;
		}
		
		#user {
			position: absolute;
			right: 20px;
			top: 16px;
			line-height: 12px;
			color: #fff;
			font-size: 18px;
		}
		
			#user img {
				vertical-align: middle;
			}
			
			#user span {
				font-weight: normal;
				font-size: 12px;
				color: #B5DCDF;	
			}

/*------------------ @#Main-Body------------------*/
	
	.colOne{
	    margin:20px auto;
	    width: 80%;
	    max-width:1200px;
	    overflow: hidden;
	 
	    }
	
	.colThree{
	    width: 31%;
	    float: left;
	    overflow: hidden;
	    float:left;
	    padding-left:30px;
	    padding-bottom: 20px;
	}
	
	.colTwo{
	    width: 45%;
	    overflow: hidden;
	    /*padding-right: 20px;*/
	    padding-bottom: 20px;
	    min-width:350px;
	    float:left;
	    min-width:300px;
	}
	
	.colLeft{
	    
	    padding-right: 20px;
	}
	.colRight {
	    padding-left:20px;
	    
	    
	}
	
	
	.col450 {
	width: 450px;
	float: left;
	overflow: hidden;
	padding-right: 20px;
	padding-bottom: 20px;
}
	
	.col675 {
		width: 675px;
		float: left;
		overflow: hidden;
		padding-right: 20px;
		padding-bottom: 20px;
	}
	
	.col225 {
		
		overflow:hidden;
		padding-bottom:20px;
		padding-left:70px;
        width:42%;
	}

		
		
		
	#Main-Body{
	    background:#ffffff;
        /*overflow:hidden;*/
        padding:15px 20px 10px;
	}
	
	.bordered {
	border: 5px solid #eee;
	background: #eee;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

	.bordered .inside, .blue-border-wrap .inside, .red-border-wrap .inside  {
		background: #fff;
		border: 1px solid #bbb;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		padding: 15px;
		overflow: hidden;
	}

	.bordered table {
		width: 100%;
		color: #444;
		border-collapse: collapse;
	}
	
		.bordered table a {
			text-decoration: underline;
			color: #144e89;
		}
		
			.bordered table a:hover {
				color: #dd3128;
			}
		
		.bordered table h4 a {
			color: #0d4f55;
			font-size: 14px;
		}
		
		
		.bordered table.nohover tr:hover td {
			background: none;
		}
		
		.bordered table tr.even td  /*, .bordered table tr.even:hover td*/ {
			background: #f3f3f3;
		}
		
		.bordered table tr.odd td /*,.bordered table tr.odd:hover td*/ {
			background: #fff;
		}
		
			.bordered table tr:hover td {
				background: #e0e8f0/*fred*/;
			}
			
		
		.bordered table th {
			padding: 5px 5px 11px 5px;
			color: #888;
			font-size: 11px;
			font-style: italic;
			font-weight: normal;
			background: url(../images/th.gif) repeat-x left bottom;
		}
		
		.bordered table td {
			padding: 5px;
			vertical-align: top;
			/*border-bottom: 1px solid #bbb;*/
			border: 0px solid #bbb;
		}
		
		/*.tag {
			width: 50px;
			vertical-align: middle;
		}*/
		
			/*.tag span {
				background-color: #eee;
				border: 1px solid #eee;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				color: #fff;
				font-size: 10px;
				line-height: 10px;
				text-align: center;
				padding: 3px 2px 5px 2px;
				display: block;
				width: 50px;
			}
		
				.tag .proposals { background: #29919b; border: 1px solid #29919b; }
				.tag .comment,
				.tag .meeting { background: #bf62e1; border: 1px solid #bf62e1; }
				.tag .decline,
				.tag .denied,
				.tag .deadline { background: #dd3128; border: 1px solid #dd3128; }
				.tag .followup,
				.tag .calendars { background: #725515; border: 1px solid #725515; }
				.tag .replies,
				.tag .open { background: #3f55b3; border: 1px solid #3f55b3; }
				.tag .notes,
				.tag .postponed { background: #dd8628; border: 1px solid #dd8628; }
				.tag .invoices,
				.tag .invoice,
				.tag .accepted { background: #299b49; border: 1px solid #299b49; }
				.tag .clients,
				.tag .closed { background: #0B4751; border: 1px solid #0B4751; }
				.tag .followup { background: #725515; border: 1px solid #725515; }
				.tag .reminder { background: #0B4751; border: 1px soild #0B4751; }
			*/	

span.tag, span.comment{
    background-color: #eee;
    border: 1px solid #eee;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    /*font-size: 10px;
    line-height: 10px;
    width: 50px;*/
    text-align: center;
    padding: 3px 2px 5px 2px;
    display: block;
}



		
  .btnLnk {
    padding:0.4em 1em 0.4em 20px;
    position:relative;
    text-decoration:none;
   }
    .btnLnk  span.ui-icon {
    left:0.2em;
    margin:-8px 5px 0 0;
    position:absolute;
    top:50%;
}
.borderedAbove{}
.borderedAbove h3{
    float:left;}
    
    .borderedAbove .btnLnk {
    float:right;
    margin-bottom:5px;}
    
       td .btnLnk {
    padding:0.2em 0.4em 0.2em 18px;}

span.shBlue{background-color:#90c0ef; border-color:#90c0ef;}
span.shGreen{background-color:#30ef60; border-color:#30ef60;}
span.shPink{background-color:#ff00cc;border-color:#ff00cc;}
span.shYellow{background-color:#ffff00;border-color:#ffff00;}

span.su1{background:#ffcc66;}
span.su2{background:#ff6633;}
span.su3{background:#dd3128;}
span.suDone{background:#999999;}
span.suOmit{background:#9999cc;}
    
		span.comment{
		    background-color:Transparent;
		    margin-bottom:3px;
		    text-align:left;
		}	
			
			
			.bordered table td.date {
				font-weight: bold;
				text-transform: uppercase;
				font-size: 11px;
				width: 100px;
				text-align: right;
			}
			
			.bordered table#todays-events td.date {
				width:140px;
			}
			
			.bordered table td.edit {
				vertical-align: bottom;
				text-align: right;
				width: 150px;
			}
				.bordered table td.edit a { color: #666; }
				.bordered table td.edit a:hover { color: #7F0600; }
			
				.bordered table td.edit p { visibility: hidden; }
				.bordered table tr:hover td.edit p { visibility: visible; }
			
			p.customize {
				text-align:right;
				padding: 5px 0;
			}
			
				p.customize a {
					color: #777;
					font-size: 11px;
				}

			.bordered table .email {
				color: #777;
			}
			
			.bordered table td a.client-url {
				color: #666;
			}
			
			.bordered table td a.client-url:hover { color: #666; }

			.bordered table td .client-links {
				font-size: 11px;
			}
			
			.bordered table tr.noborder td { border: 0; }


	/*.blue-border-wrap { margin-bottom: 5px; }*/
	span.input-wrap, .blue-border-wrap {
				border: 1px solid #43678a;
				background: #43678a;
				padding: 5px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				display: block;
			}
			
		.red-border-wrap {
				border: 1px solid #cc3333;
				background: #cc3333;
				padding: 5px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				display: block;
			}
	
/*------------------ @#Main-Bottom ------------------*/
	#Main-Bottom {
	    background: #ffffff;
	    line-height: 1px;
	    font-size: 1px;
	    height: 10px;
	    -moz-border-radius-bottomleft:9px;
        -moz-border-radius-bottomright:9px;
        -webkit-border-radius-bottomleft: 9px;
        -webkit-border-radius-bottomright: 9px;
	}

/*------------------ @footer ------------------*/		
#footer {
	font-size: 11px;
	color: #ffffff;
	padding-bottom: 20px;
}

	#footer a {
		color: #b3e1e5;
	}

#frenzylabs {
	padding-top: 20px;
	text-align: center;
}

/*-------------------~@Form------------------*/
.form {
}

	.form dl {
		display: block;
		width: 100%;
	}
	
		.form dt {
			clear: left;
			float: left;
		}
		
			.form dt label {
				display: block;
				color: #444;
			}
			
			.form dt,
			.form dt label {
				display: block;
				width: 120px;
			}
			
			.form dt label {
				padding-top: 12px;
			}
			
			.form dd label {
				width: 100%;
			}
			
			.form dd em {
				font-size: 10px;
				color: #777;
			}
		
		.form dd {
			padding-bottom: 5px;
			float: left;
		}
		
		.form dd label input {
			vertical-align: top;
		}
		
		.form dd label.clearboth {
			clear: both;
			float: none;
			display: block;
			padding-top: 5px;
		}
		
		.form dd label.clearboth input {
			width: 30px;
		}
		
			.form dd.field_errors ul {
				list-style: none;
				margin: 0;
				padding-left: 120px;
				color: red;
			}
		
			span.input-wrap, .blue-border-wrap {
				border: 1px solid #c5d0db ;
				background: #c5d0db ;
				/*padding: 5px;*/
				padding: 2px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				display: block;
			}
			
			.form div.error,
			.form dd.error span.input-wrap {
				background: #ffc;
			}
			
			.form div.okay,
			.form dd.okay span.input-wrap {
				background: #D5EFC2;
			}
			
				.form dd.okay span.input-wrap input {
					border-color: #85CF4D;
				}
			
			.form div.error input,
			.form div.error select,
			.form div.error textarea {  
				background: #fff url(../images/error.gif) no-repeat 600px 5px;
			}
			
			.form dd.error span.input-wrap input,
			.form dd.error span.input-wrap textarea {
				background: #fff url(../images/error.gif) no-repeat 97% 5px;
			}
			
			.form div.okay input,
			.form div.okay select,
			.form div.okay textarea {  
				background: #fff url(../images/okay.gif) no-repeat 600px 5px;
			}
			
			.form dd.okay span.input-wrap input,
			.form dd.okay span.input-wrap textarea {
				background: #fff url(../images/okay.gif) no-repeat 97% 5px;
			}
			
				.form dd span.input-wrap input#id_url {
					background-position: 90px 5px;
				}
			
			ul.errorlist {
				margin: 0;
				padding: 0 0 0 2px;
				list-style: none;
				display: block;
				color: #5F5F2F;
			}
			
			span.fixpad {
				display: block;
				padding: 10px 0 10px 0;
				font-size: 14px;
			}
			
			.red-border-wrap, .blue-border-wrap { margin-bottom: 5px; }
		
			.form input,
			.form textarea,
			.form select,
			.form .savedInfo {
				/*font: normal 14px/14px "Lucida Grande", "Lucida Sans Unicode", "Helvetica Neue", Helvetica, Arial, sans-serif;*/
				padding: 5px;
				border: 1px solid #bbb;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				width: 240px;
			}
			.form .savedInfo{display:block;} 
			.form select {
				width: 252px;
			}
			
			.inplaceEdit input,
			.inplaceEdit textarea,
			.inplaceEdit select {
				font: normal 12px/14px "Lucida Grande", "Lucida Sans Unicode", "Helvetica Neue", Helvetica, Arial, sans-serif;
				padding: 5px;
				border: 2px solid #336a70;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				width: 240px;
			}
			
			.form textarea {
				height: 100px;
			}
			
			.col675 .form input,
			.col675 .form textarea {
				width: 611px;
			}
			
			.col675 .form select {
				width: 623px;
			}
			
			.form textarea.create-proposal-text {
				font-size: 11px;
			}
			
		.form input.field-on,
		.form select.field-on,
		.form textarea.field-on {
			border-color: #144e89;
		}
		
		.form dd.error span.input-wrap input.field-on {
			background: #fff;
		}
		
	label.plain {
		width: 100px;
		font-weight: bold;
		padding-right: 10px;
		padding-left: 30px;
	}
		
.buttons {
	padding-top: 20px;
	clear: both;
	color: #777;
	padding-left: 120px;
}

.buttons a {
		color: #15676E;
	}
	
	button.button, a.button {
		border: 0;
		background: url(../images/button-bg.png) no-repeat 0 0;
		display: block;
		float: left;
		padding: 4px 15px 6px 15px;
		cursor: pointer;
		color: #555;
		margin-right: 5px;
		width: 136px;
		height: 35px;
		font-weight: bold;
		text-transform: uppercase;
		margin-top: -10px;
		text-decoration: none;
		text-align:center;
	}
	
		a.button {
			padding: 8px 15px 0px 15px;
			height: 27px;
			width: 106px;
		}
		
		#accepted, #postponed, #denied {
			margin: 0 auto;
			float: none;
		}
		
		#accepted { background-image: url(../images/accept.png); margin-bottom: 15px;}
		#postponed { background-image: url(../images/postpone.png); margin-bottom: 15px;}
		#denied { background-image: url(../images/deny.png);}

/*------------------ @other ------------------*/	
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}